<template>
	<view class="content_bg">
		<view class="content">
			<!-- 表单 -->
			<view class="contentForm">
				<u-form labelPosition="top" ref="loginForm" :model="loginForm" :labelStyle="labelStyle">
					<u-form-item label="姓名" prop="name">
						<view class="formInput">
							<u-input placeholder="请输入名字" v-model="loginForm.name" clearable border="none"
								fontSize="26rpx" color="#333"
								customStyle="background:#F3F3F3;border-radius: 6px"></u-input>
						</view>
					</u-form-item>
					<u-form-item label="身份证号" labelWidth="100" prop="idCard">
						<view class="formInput">
					
							<u-input placeholder="请输入身份证号" border="none" fontSize="26rpx" color="#333"
								v-model="loginForm.idCard" clearable />
						</view>
					</u-form-item>
					<u-form-item label="绑定手机号" labelWidth="100" prop="mobile">
						<view class="formInput">
				
							<u-input placeholder="请输入手机号" border="none" fontSize="26rpx" color="#333"
								v-model="loginForm.mobile" clearable />
						</view>
					</u-form-item>
					<u-form-item label="验证码" labelWidth="100" prop="checkCode">
						<view class="flex_wrap">
							<view class="formInput_t">
								<u-input placeholder="请输入验证码" border="none" fontSize="26rpx" color="#333"
									v-model="loginForm.checkCode" clearable />
							</view>
							<button :class="
						            codeTxt == '获取验证码' ? 'btn' : 'activebtn'
						        " @click="getValidCode">
								{{ codeTxt }}
							</button>
						</view>
					</u-form-item>
				</u-form>
				<view class="flex_wrap row_center">
					<view class="lq_btn" @click="to_success('loginForm')">
						激活
					</view>
				</view>
			</view>
		</view>
	</view>

</template>

<script>
	import {
		baseUrl
	} from "@/config/tendIdConfig";
	import { mapGetters } from "vuex"
	export default {
		data() {
			return {
				// cardPackId:'7044091922547343361',//卡包id
				// sign:'y13bc4xLS/jvOzxURrvJbw==',//签名
				// unionId:'o_KUm66R2r9I_3XkXA7om53hEFmE',//unionId
				cardPackId:'',//卡包id
				sign:'',//签名
				unionId:'',//unionId
				labelStyle: {
					fontSize: "36rpx",
					color: "#333",
					fontWeight: "bold",
				},
				codeTxt: "获取验证码",
				loginForm: {
					mobile: "",
					checkCode: "",
					name: "",
					idCard: "",
				},
				loginFormRules: {
					name: [{
						type: "string",
						required: true,
						message: "请填写姓名",
						trigger: ["blur", "change"],
					}, ],
					checkCode: {
						type: "string",
						required: true,
						len: 6,
						message: "请填写6位验证码",
						trigger: ["blur"],
					},
					mobile: [{
							required: true,
							message: "请输入手机号",
							trigger: ["change", "blur"],
						},
						{
							validator: (rule, value, callback) => {
								return uni.$u.test.mobile(value);
							},
							message: "手机号码不正确",
							trigger: ["change", "blur"],
						},
					],
					idCard: [
					    {
					        type: "string",
					        required: true,
					        message: "请填写身份证",
					        trigger: ["blur", "change"],
					    },
					    {
					        validator: (rule, value, callback) => {
					            return this.$u.test.idCard(value);
					        },
					        message: "身份证号格式不正确",
					        trigger: ["blur"],
					    },
					],
				},
			}
		},
		onReady() {
			this.$refs.loginForm.setRules(this.loginFormRules);
		},
		beforeDestroy() {
		    if (this.isLogin) {
		        uni.removeStorageSync("loginBackUrl");
		        uni.removeStorageSync("loginBackUrlOption");
		    }
		},
		onLoad(options) {
			console.log(options,'接入得参数',this.isLogin)
			this.cardPackId = options.id//卡包id
			this.sign = options.sign//签名
			this.unionId = options.unionId//unionId
			
			// 解决微信扫码登录 新用户登录跳回 该页面
			var pages = getCurrentPages(); // 获取栈实例
			if (pages.length === 1) {
				let currentRoute = pages[pages.length - 1].route; // 获取当前页面路由
				let currentPage = pages[pages.length - 1]["$page"]["fullPath"]; //当前页面路径(带参数)
				uni.setStorageSync("loginBackUrl", currentPage);
			}
			if (!this.isLogin) return uni.reLaunch({ url: "/pages/user/phone/indexApp" })
		},
		computed: mapGetters(["userInfo", "isLogin"]),
		methods: {
			getValidCode() {
				//点击获取验证码
				if (this.loginForm.mobile == "") {
					uni.$u.toast('请输入手机号');
				} else if (!/^1[3456789][0-9]{9}$/.test(this.loginForm.mobile)) {
					uni.$u.toast('手机号有误，请检查');
				} else {
					//发送验证码
					this.getPhoneSendMsm();
				}
			},
			getPhoneSendMsm() {
				//发送验证码
				const token = this.$store.getters?.customer_token || uni.getStorageSync("customer_token")
				const that = this
				uni.request({
					url: baseUrl + `/customer/cardPack/sendMsm/${that.loginForm.mobile}`,
					method: 'GET',
					header: {
						Authorization: token
					},
					success(res) {
						if ([991, 992, 401].includes(res.data.code)) {
							uni.$u.toast(res.data.msg)
							that.$store.commit("SET_LOGOUT")
							uni.reLaunch({
								url: "/pages/user/phone/indexApp"
							})
							return
						}
						if (res.data.code === 200) {
							if (that.codeFlag == false) {
								return;
							}
							that.codeFlag = false;
							var time = 30;
							that.codeTxt = time + "s";
							var timer = setInterval(() => {
								that.codeTxt = "获取验证码";
								if (time == 1) {
									that.codeFlag = true;
									clearInterval(timer);
								} else {
									time--;
									that.codeTxt = time + "s";
								}
							}, 1000);
						} else {
							uni.$u.toast(res.data.msg);
						}
					},
					fail(error) {
						uni.$u.toast(res.data.msg);
						console.log('111')
					}
				})
			},
			to_success() {
				const token = this.$store.getters?.customer_token || uni.getStorageSync("customer_token")
				const that = this;
				this.$refs.loginForm
					.validate()
					.then((res) => {
						uni.request({
							url: baseUrl + `/customer/cardPack/activationCard`,
						    method: "POST",
							header: {
								Authorization: token
							},
						    data: {
						        activatorPhone: that.loginForm.mobile,
						        activatorName: that.loginForm.name,
						        code: that.loginForm.checkCode,
						        activatorIdCard: that.loginForm.idCard,
								number:'1',//数量
								cardPackId:that.cardPackId,//卡包id
								sign:that.sign,//签名
								unionId:that.unionId,//unionId
								activationUniqueCode:'111',//激活唯一码
						    },
						    success(res) {
						        console.log(res,res.data.data);
								if (res.data.code === 200) {
									uni.$u.toast('激活成功！');
									that.$u.route({
										url: "/pages_card/writeResults/index",
										params: {
											workState: '3',
										}
									})
								}else {
									uni.$u.toast(res.data.msg);
								}
						    },
						});
					})
					.catch((errors) => {
					});
			},
		}
	}
</script>

<style scoped>
	* {
		padding: 0;
		margin: 0;
	}

	.content_bg {
		width: 100%;
		height: 100%;
		background: #3e3e3e;
	}

	.content {
		padding:32rpx 28rpx;
	}
	
	.contentForm {
		width: 100%;
		background: #FFFFFF;
		border-radius: 20rpx;
		padding: 32rpx 28rpx 54rpx;
	}
	
	.formInput,
	.formInput_t {
		height: 80rpx;
		background: #f3f3f3;
		border-radius: 12rpx;
		display: flex;
		align-items: center;
		padding: 0 20rpx;
	}
	
	.formInput_t {
		width: 460rpx;
	}
	
	.btn {
		width: 180rpx;
		height: 80rpx;
		line-height: 80rpx;
		background: #F7D25B;
		border-radius: 8rpx;
		font-size: 28rpx;
		color: #333;
		padding: 0;
	}
	
	.activebtn {
		width: 180rpx;
		height: 80rpx;
		background: #aaa;
		border-radius: 8rpx;
		line-height: 80rpx;
		font-size: 28rpx;
		color: #fff;
		padding: 0;
	}
	.lq_btn {
		width: 520rpx;
		height: 86rpx;
		background: linear-gradient(315deg, #E9A656 0%, #FDE3B6 100%);
		border-radius: 40000rpx 40000rpx 40000rpx 40000rpx;
		line-height: 86rpx;
		text-align: center;
		font-size: 32rpx;
		color: #333333;
		margin-top: 80rpx;
	}
</style>